<!DOCTYPE html>
<html>
<head>
    <style>
        #infoType li a{
            padding:16px 15px;
            font-size:15px
        }
        .main-content{
            position: absolute;
            top:0;
            bottom:0;
            left:0;
            right:0;
        }
        .wrapper{
            height:100%;
            padding:15px 0 0 15px;
        }
    </style>

    <title>通知</title>
    <link rel="stylesheet" href="/css/jqpagination.css" />
    <link rel="stylesheet" type="text/css" href="/js/gritter/css/jquery.gritter.css" />
    <%- include headInclude.ejs %>
    <script id="template" type="text/html">
        <li class="list-group-item ">

            <a class="" href="#">
                <small class="pull-right text-muted" style="width: 110px;">{time}</small>
                <strong>{title}</strong>
                <span>{detail}</span>
                <span class="item-type" style="display: none;">{type}</span>
            </a>
    </script>
    <script id="get-pager" type="text/html">
        <div id="pager" class="pull-right" style="margin: 0!important;height:30px;">
            <a href="#" class="first btn btn-sm btn-primary" data-action="first"><i class="fa fa-backward"></i></a>
            <a href="#" class="previous btn btn-sm btn-primary" data-action="previous"><i class="fa fa-chevron-left"></i></a>
            <input type="text" readonly="readonly" data-max-page="40" style="width:60px;text-align:center;"/>
            <a href="#" class="next btn btn-sm btn-primary" data-action="next"><i class="fa fa-chevron-right"></i></a>
            <a href="#" class="last btn btn-sm btn-primary" data-action="last"><i class="fa fa-forward"></i></a>
        </div>
    </script>
</head>
<body class="sticky-header">
<section>
    <%- include header.ejs %>
    <div class="main-content">
    <%- include nav.ejs %>
    <div class="wrapper">
        <div class="mail-box">
            <aside class="mail-nav mail-nav-bg-color">
                <header class="header"> <h4>消息列表</h4> </header>
                <div class="mail-nav-body">
                    <div class="text-center">
                        <a class="btn btn-compose" id="getbyclass" href="#" onmouseover="this.innerHTML = '查看全部'" onmouseout="this.innerHTML = '分类查看'">
                            分类查看
                        </a>
                    </div>
                    <ul id="infoType" class="nav nav-pills nav-stacked mail-navigation">
                        <li><a href="#" id="type-start-run"> <i class="fa fa-play"></i> 开始运行  <span id="startRun" class="label label-info pull-right inbox-notification"></span></a></li>
                        <li><a href="#" id="type-stop-run"> <i class="fa fa-stop"></i> 停止运行 <span id="stopRun" class="label label-info pull-right inbox-notification"></span></a></li>
                        <li><a href="#" id="type-del-ms"> <i class="fa fa-trash-o"></i> 删除服务 <span id="delServer" class="label label-danger pull-right inbox-notification"></span></a></li>
                    </ul>
                </div>
            </aside>
            <section class="mail-box-info">
                <header id="header" class="header">
                    <div id="pager" class="pull-right" style="margin: 0!important;height:30px;">
                        <a href="#" class="first btn btn-sm btn-primary" data-action="first"><i class="fa fa-backward"></i></a>
                        <a href="#" class="previous btn btn-sm btn-primary" data-action="previous"><i class="fa fa-chevron-left"></i></a>
                        <input type="text" readonly="readonly" data-max-page="40" style="width:60px;text-align:center;"/>
                        <a href="#" class="next btn btn-sm btn-primary" data-action="next"><i class="fa fa-chevron-right"></i></a>
                        <a href="#" class="last btn btn-sm btn-primary" data-action="last"><i class="fa fa-forward"></i></a>
                    </div>

                    <div class="btn-toolbar">
                        <div class="btn-group">
                            <button id="btn-refresh" class="btn btn-sm btn-primary"><i class="fa fa-refresh"></i></button>
                        </div>

                        <div class="btn-group select">
                            <button data-toggle="dropdown" class="btn btn-primary btn-sm dropdown-toggle">
                                <span id="selectedType" style="width: 70px;" class="dropdown-label">所有</span>
                                <span class="caret"></span>
                            </button>
                            <ul id="typeUL" class="dropdown-menu text-left text-sm">
                                <li><a href="#">所有</a></li>
                                <li><a href="#">未读</a></li>
                                <li><a href="#">已读</a></li>
                            </ul>
                        </div>

                        <div class="btn-group">
                            <button id="btn-HasReaded" class="btn btn-sm btn-primary"><i class="fa fa-check"></i>&nbsp&nbsp全部标为已读</button>
                        </div>
                    </div>

                </header>

                <section class="mail-list">
                    <ul id="notices" class="list-group "></ul>
                </section>

            </section>
        </div>
    </div>
    <%- include footer.ejs %>
    </div>
</section>
<%- include footerInclude.ejs %>

<script src="/js/jquery.jqpagination.js"></script>
<script type="text/javascript" src="/js/gritter/js/jquery.gritter.js"></script>
<script src="/js/geomodel/notice.js"></script>

</body>
</html>
